<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    
	
	<title>_${customer.customerName}_入库点收</title>
	<script type="text/javascript">
	
	
	   Array.prototype.contains = function(element) {
	     for(var i=0; i<this.length; i++) {
	         if (this[i]==element) {
	             return true;
	         }
	     }
	     return false;
	   };
	
       $(function() {
	     $("#queryForm").validate(); 
		 $("#_fromDate").datepicker({ format:'yyyy-mm-dd'});
		 $("#_toDate").datepicker({ format:'yyyy-mm-dd'});
		 
		 $("#count").val("");
		 $("#count").focus();
		 $("#typeChooser_2").attr("checked","checked");
		 carCount=0;
		 
		 var status='${bill.status}';
		 if(status=='1' || status=='4'){
		   $("#submit_btn").attr("disabled", false);
		 }else{
		   $("#submit_btn").attr("disabled", true);
		   $("#recount_btn").attr("disabled", true);
		   $("#submit_btn").attr("class", "btn");
		   $("#recount_btn").attr("class", "btn");
		   $("#count").attr("readonly",true);
		 }
		 
       });
       
       var curType=1;
       var arr_sku = new Array(); //SKU数组
       var carLimit=50;  //车货物数量限制
       
       //radio事件
       function typeChange(element){
         curType=$(element).val();
         $("#count").focus();
       }
       
       
       //点数
       function count(element){
       try{
         var sku=$(element).val();
         var num;
         if(curType==1){  //扫描整箱件
            if(arr_sku.contains(sku)){  //已包含
                var num=prompt("请输入整箱货物的数量：",0);
			    if(isNaN(num)||num.trim()==""||num == null){
				    alert("您的输入有误，请重新扫描！");
				    $("#count").val("");
                    $("#count").focus();
                    return;
				}else{
				  addBox(sku,num);
				}
			}else{   //未包含
			    num=prompt("请输入整箱货物的数量：",0);
			    if(isNaN(num)||num.trim()==""||num == null){
				    alert("您的输入有误，请重新扫描！");
				    $("#count").val("");
                    $("#count").focus();
                    return;
				}else{
				  arr_sku.push(sku);
			      addRow(sku,1,num); 
				}
			}
			inCar(1,sku,num);
         }
         else if(curType==2){  //扫描散货件
			if(arr_sku.contains(sku)){  //已包含
               addRight(sku,1);
			}else{   //未包含
			   arr_sku.push(sku);
			   addRow(sku,2,1); 
			}
			inCar(2,sku,1);
         }
         else if(curType==3){  //扫描破损件
         	if(arr_sku.contains(sku)){  //已包含
               addError(sku,1);
			}else{   //未包含
			   arr_sku.push(sku);
			   addRow(sku,3,1); 
			}
			inCar(3,sku,1);
         }
         
        } catch(e){
            alert("error!");
         }
         
         $("#count").val("");
         $("#count").focus();
         
       }
       
       //添加散件
       function addRight(sku,num){
          var right_id="#right"+sku;
          var total_id="#total"+sku;
          $(right_id).val( Number($(right_id).val())+Number(num) );
          $(total_id).val( Number($(total_id).val())+Number(num) );
       }

	   //添加破损件	       
       function addError(sku,num){
          var error_id="#error"+sku;
          var total_id="#total"+sku;
          $(error_id).val( Number($(error_id).val())+Number(num) );
          $(total_id).val( Number($(total_id).val())+Number(num) );
       }
       
       //添加整箱件 
       function addBox(sku,num){
          var box_id="#box"+sku;
          var boxStr_id="#boxStr"+sku;
          var total_id="#total"+sku;
          $(box_id).val( Number($(box_id).val())+Number(num) );
          
          var temp=$(boxStr_id).val();
          if(temp==""){
            $(boxStr_id).val(num);
          }else{
            $(boxStr_id).val(temp+"+"+num );
          }
          
          $(total_id).val( Number($(total_id).val())+Number(num) );
        }
       
       //添加一行
       function addRow(sku,type,num){
            var rightNum;
            var errorNum;
            var boxNum;
            var totalNum;
            var boxStr;
            
            if(type==1){
               rightNum=0;
               errorNum=0;
               boxStr=num;
               boxNum=num;
               totalNum=num;
            }else if(type==2){
               rightNum=num;
               errorNum=0;
               boxStr="";
               boxNum=0;
               totalNum=num;
            }else if(type==3){
               rightNum=0;
               errorNum=num;
               boxStr="";
               boxNum=0;
               totalNum=num;
            }
            
            var tr="<tr id='row"+sku+"' name='row"+sku+"'>";
			tr+="<td><input type='text' style='width:200px;' value="+sku+" disabled='disabled'></td>";
			tr+="<td><input type='text' style='width:130px;' name='right"+sku+"'  id='right"+sku+"' class='required digits' value="+rightNum+" disabled='disabled'></td>";
			tr+="<td><input type='text' style='width:130px;' name='error"+sku+"' id='error"+sku+"' class='required digits' value="+errorNum+" disabled='disabled'></td>";
			tr+="<td><input type='text' name='boxStr"+sku+"' disabled='disabled' id='boxStr"+sku+"' value="+boxStr+" >";
			tr+="<input type='hidden' style='width:0px;' name='box"+sku+"' id='box"+sku+"' value="+boxNum+"></td>";
			tr+="<td><input type='text' style='width:130px;' name='total"+sku+"' id='total"+sku+"' value="+totalNum+" disabled='disabled'></td>";
			tr+="</tr>";
			    	
		    $("#count_table").append(tr);	
       }
       
       var carCount=0;
       
       //装车
       function inCar(type,sku,num){
          $("#message").animate({width:200},200);
           
          if(type==1){ //整箱件
            var count=0;
            var flag=0;
            $("#box_car").children("input").each(function(i,n){
                 count++;
			     var obj = $(n);
			     var val=obj.val();
			     //if((Number(val)+Number(num))<=carLimit){
			        obj.val(Number(val)+Number(num));
			        flag=1;
			        $("#message").val("请放入: 整装"+count+"号车");
			        setCarInfo("boxCar"+count,sku,num);
			    // }
		     }); 
		     //添加新车
		     if(flag==0){
		         count++;
			     var temp="<a id='titleboxCar"+count+"' title='' style='margin-left: 10px;' >整装车</a> <input type='text' style='width:50px;margin-top:5px;' id='boxCar"+count+"' value='"+num+"' disabled='disabled'/>"
			     $("#box_car").append(temp);
			     $("#message").val("请放入： 整装"+count+"号车");
			     setCarInfo("boxCar"+count,sku,num);
		     }
		     
          }
          else if(type==2){ //散货件
             
		     if(carCount==0){ //如果没车，添加新车
		         carCount++;
			     var temp="<a id='titlerightCar"+carCount+"'' title='' style='margin-left: 10px;' >"+carCount+"号车</a> <input type='text' style='width:50px;margin-top:5px;' id='rightCar"+carCount+"' value='"+num+"' disabled='disabled'/>"
			     $("#right_car").append(temp);
			     $("#message").val("请放入： 散装"+carCount+"号车");
			     setCarInfo("rightCar"+carCount,sku,num);
		     }else{
		        var obj =$("#rightCar"+carCount);
		        var val=obj.val();
		        if(Number(val)<Number(carLimit)){
			        obj.val(Number(val)+Number(num));
			        $("#message").val("请放入： 散装"+carCount+"号车");
			        setCarInfo("rightCar"+carCount,sku,num);
			    }else{  //如果车超载，添加新车
			        carCount++;
			        var temp="<a id='titlerightCar"+carCount+"'' title='' style='margin-left: 10px;' >"+carCount+"号车</a> <input type='text' style='width:50px;margin-top:5px;' id='rightCar"+carCount+"' value='"+num+"' disabled='disabled'/>"
			        $("#right_car").append(temp);
			        $("#message").val("请放入： 散装"+carCount+"号车");
			        setCarInfo("rightCar"+carCount,sku,num);
			    }
		     }
		     
          }
          else if(type==3){ //破损件
            var count=0;
            var flag=0;
            $("#error_car").children("input").each(function(i,n){
                 count++;
			     var obj = $(n);
			     var val=obj.val();
 			     //if(val<carLimit){
			        obj.val(Number(val)+Number(num));
			        flag=1;
			        $("#message").val("请放入： 破损"+count+"号车");
			        setCarInfo("errorCar"+count,sku,num);
 			     //}
		     }); 
		     //添加新车
		     if(flag==0){
		         count++;
			     var temp="<a id='titleerrorCar"+count+"'' title='' style='margin-left: 10px;'>破损车</a><input type='text' style='width:50px;margin-top:5px;' id='errorCar"+count+"' value='"+num+"' disabled='disabled'/>"
			     $("#error_car").append(temp);
			     $("#message").val("请放入： 破损"+count+"号车");
			     setCarInfo("errorCar"+count,sku,num);
		     }
          }
          
          
          
          //加载车提示信息
          if(type==1){
               var title_id="#titleboxCar1";
			   var title=$(title_id).attr("title");
			   title+="【"+sku+"】"+num+"件　";
			   $(title_id).attr("title",title);
          }else{
	            for(var i=0;i<carInfoArray.length; i++){
	                var carInfo=carInfoArray[i];
					var _carId=carInfo["carId"];
					var _num=carInfo["num"];
					var _sku=carInfo["sku"];
	            
	                if(_carId.indexOf("box")>=0){
	                   continue;
	                }else{
					     
					     var title_id="#title"+_carId;
					     var title=$(title_id).attr("title");
					     
					     if(title.indexOf(_sku)==-1){
					       title+="【"+_sku+"】"+_num+"件　";
					     }else{
					       title="【"+_sku+"】"+_num+"件　";
					     }
					     $(title_id).attr("title",title);
				    }
			    }
          }
          
          
          
          
       }
       
       //创建json对象
		function createItem(instorageCode,sku,rightNum,boxNum,errorNum,totalNum,boxStr){
		    return {
		        instorageCode:instorageCode,
		        sku:sku,
		        rightNum:rightNum,
		        boxNum:boxNum,
		        errorNum:errorNum,
		        totalNum:totalNum,
		        boxStr:boxStr
		    };
		}
       
       //完成点收，保存数据
       function saveCount(){
       
          $("#submit_btn").attr("disabled", true);
          var jsonarray_count=[];
          var instorageCode='${bill.instorageCode}';
       
          $("tr[name^='row']").each(function(){
             var row_id=$(this).attr("id");
             var sku=row_id.substring(3);
             
             var right_id="#right"+sku;
             var box_id="#box"+sku;
             var error_id="#error"+sku;
             var total_id="#total"+sku;
             var boxStr_id="#boxStr"+sku;
             
             var rightNum=$(right_id).val();
             var boxNum=$(box_id).val();
             var errorNum=$(error_id).val();
             var totalNum=$(total_id).val();
             var boxStr=$(boxStr_id).val();
             
             var obj=createItem(instorageCode,sku,rightNum,boxNum,errorNum,totalNum,boxStr);
             jsonarray_count.push(obj);
             
		  }); 
		  
		  var jsonList_count = eval(jsonarray_count); 
		  var jsonText_count = JSON.stringify(jsonList_count);
		  
		  var jsonList_car = eval(carInfoArray); 
		  var jsonText_car = JSON.stringify(jsonList_car);
		  
		  $.ajax({
					type:'post',
					url:'${ctx}/cusInstorageCount/ajaxCount',
					data:{
						instorageCode:instorageCode,
						jsonarray_count:jsonText_count,
						jsonarray_car:jsonText_car
					},
					dataType:'json',
					success:function(data) {
					    if(data==true){
					     
					      $("input[type='text']").each(function(){
					          $(this).attr("readonly",true);
					      });
					      
					      $("#submit_btn").attr("disabled", true);
						  $("#recount_btn").attr("disabled", true);
						  $("#submit_btn").attr("class", "btn");
						  $("#recount_btn").attr("class", "btn");
					      $("#count").attr("readonly",true);
					      window.alert("完成入库点收！！请按“确定”继续。"); 
				          location.href='${ctx}/cusInstorageCount';
					      
					    }else{
					      $("#submit_btn").attr("disabled", false);
						  $("#recount_btn").attr("disabled", false);
					      alert("网络繁忙，请稍后重试...");
					    }
					   
					},
					error:function() {
				    	$("#submit_btn").attr("disabled",false);
						alert("网络繁忙，请稍后重试...");
					}
				});
          
       }
       
       //车装货信息
       var carInfoArray=[];
       
       //创建车载信息对象
	   function createCarInfo(carId,sku,num){
		    return {
		        carId:carId,
		        sku:sku,
		        num:num
		    };
		}
		
		 //记录装车信息
		 function setCarInfo(carId,sku,num){
		      var flag=0;
		      if(carId.indexOf("box")>=0){
		      
		      }else{
			       for(var i=0; i<carInfoArray.length; i++){
				     var carInfo=carInfoArray[i];
				     var _carId=carInfo["carId"];
				     var _sku=carInfo["sku"];
				     var _num=Number(carInfo["num"]);
				     
				     if(_carId==carId && _sku==sku){
				        carInfo["num"]=Number(_num)+Number(num);
				        flag=1;
				     }
				   }
		      }
		      
		     if(flag==0){
		        var newCarInfo=createCarInfo(carId,sku,num);
		        carInfoArray.push(newCarInfo);
		     }
			 
		 }
		 
		 //提示框动画效果
		 var effectFlag=0;
		 function effect(){
		   effectFlag=1;
		 }
		 function keyDown(){
			 if(effectFlag==1){
			    $("#message").animate({width:0},200);
			   effectFlag=0;
			 }
		 }
		
		
	    function showBillDetail(){
	      
	      var flag=$("#showOrhide").html();
	      
	      if(flag=="【隐藏明细】"){
	        $("#billDetail").css("display","none");
	        $("#showOrhide").html("【查看明细】");
	      }
	      else if(flag=="【查看明细】"){
	        $("#billDetail").css("display","");
	        $("#showOrhide").html("【隐藏明细】");
	      }
	      
	    }
	    
	    function carLimitChanged(){
	      carLimit=$("#carLimit").val();
	    }
		 
		
		
	  
    </script>
</head>

<body>
	　　
	　  <!-- 入库登记数据 -->
	  <table class="table table-striped table-bordered table-condensed" style="width: 95%; margin-top: 0px; margin-left: 20px;" >
       	  <thead>
		    <th style="vertical-align: middle; color: white;" colspan="6" bgcolor="#8EB4CB">入库登记数据</th>
		  </thead>
          <tr>
             <th style="width: 80px;">入库类型</th>
             <th style="width: 120px;">入库编号</th>
             <th style="width: 120px;">相关单号</th>
             <th style="width: 100px;">箱子数量</th>
             <th style="width: 100px;">SKU数量</th>
             <th style="width: 100px;">商品数量</th>
          </tr>
          <tr>
             <td>
               <c:if test="${bill.billType eq '1' }"><font color=red>总仓入库</font></c:if>
			   <c:if test="${bill.billType eq '2' }"><font color=blue>调拨入库</font><a href="" onclick="showBillDetail(); return false;" id="showOrhide">【查看明细】</a></c:if>
             </td>
             <td>${bill.instorageCode}</td>
             <td>${bill.aboutCode}</td>
             <td>${bill.boxNum}</td>
             <td>${bill.skuNum}</td>
             <td>${bill.goodsNum}</td>
          </tr>
	  </table>  
	  
	  <!-- 入库单明细 -->
	  <table class="table table-striped table-bordered table-condensed" style="width: 95%; margin-top: 0px; margin-left: 20px; display: none;" id="billDetail">
       	  <thead>
		    <th style="vertical-align: middle; color: white;" colspan="5" bgcolor="#8EB4CB">入库登记数据</th>
		  </thead>
          <tr>
             <th style="width: 120px;">商家编码</th>
             <th style="width: 120px;">sku</th>
             <th style="width: 100px;">数量</th>
          </tr>
          <c:forEach  items="${billItemList}" var="billItem">
             <tr>
               <td>${billItem.customerCode}</td>
               <td>${billItem.sku}</td>
               <td>${billItem.num}</td>
             </tr>
          </c:forEach>
	  </table>  
	  
	   <table class="table table-striped table-bordered table-condensed" style="width: 95%; margin-top: 0px; margin-left: 20px;"  >
       	  <thead>
		    <th style="vertical-align: middle; color: white; " colspan="5" bgcolor="#8EB4CB">
		                     装车数据
		    </th>
		  </thead>
          <tr>
             <th style="width: 100px;">车类型</th>
             <th >装货信息</th>
             <th style="width:100px;">载货量</th>
          </tr>
          <tr style="vertical-align:middle; height:50px;" >
            <td style="vertical-align:middle;">整装车</td>
            <td style="vertical-align:middle;" id="box_car"></td>
            <td></td>
          </tr>
          <tr style="vertical-align:middle; height:50px;" >
            <td style="vertical-align:middle;">散装车</td>
            <td style="vertical-align:middle;" id="right_car"></td>
            <td>
               <select name="carLimit" id="carLimit" style="width: 80px;" onchange="carLimitChanged();">
                   <option value="10">10</option>
                   <option value="20">20</option>
                   <option value="30">30</option>
                   <option value="40">40</option>
                   <option value="50" selected="selected">50</option>
                   <option value="60">60</option>
                   <option value="70">70</option>
                   <option value="80">80</option>
                   <option value="90">90</option>
                   <option value="100">100</option>
                   <option value="200">200</option>
                   <option value="300">300</option>
                   <option value="500">500</option>
                   <option value="800">800</option>
                   <option value="1000">1000</option>
               </select>
            </td>
          </tr>
          <tr style="vertical-align:middle; height:50px;" >
            <td style="vertical-align:middle;" >破损车</td>
            <td id="error_car"></td>
            <td></td>
          </tr>
	  </table>  
	  
	  <table class="table table-striped table-bordered table-condensed" style="width: 95%; margin-top: 0px; margin-left: 20px;" id="count_table" >
       	  <thead>
		    <th style="vertical-align: middle; color: white; " colspan="5" bgcolor="#8EB4CB">
		        <span >点收数据</span> 
		    </th>
		  </thead>
		  <thead>
		     <th style="vertical-align: middle; height: 50px;" colspan="5" >
		      <span style="margin-left: 0px;">录入/扫描SKU：<input type='text' style='width: 200px;' id="count" onchange="count(this);" onfocus="effect();" onkeydown="keyDown();"></span>
		      <input name="typeChooser" id="typeChooser_1" type="radio" value="1" onclick="typeChange(this);" checked="checked" style="margin-left:20px; margin-top:-5px;">整箱件</input>
		      <input name="typeChooser" id="typeChooser_2" type="radio" value="2" onclick="typeChange(this);"  style="margin-left:20px; margin-top:-5px;">散货件</input>
		      <input name="typeChooser" id="typeChooser_3" type="radio" value="3" onclick="typeChange(this);"  style="margin-left:20px; margin-top:-5px;">破损件</input>
		      <input type='text' style='width:0px; margin-left:20px; margin-top:7px; height:30px; border:none; font-weight:bold;  background-color:#B0CEA3';" id="message" />
		     </th>
		  </thead>
          <tr>
             <th style="width: 200px;">SKU编码</th>
             <th style="width: 130px;">散货件数量（件）</th>
             <th style="width: 130px;">破损件数量（件）</th>
             <th >整箱件数量（件/箱）</th>
             <th style="width: 130px;">总数量（件）</th>
          </tr>
	  </table>  
	  
	  <div class="form-actions">
		<input id="submit_btn" class="btn btn-primary" type="button" value="完成点收" style="margin-left: 100px;" onclick="saveCount();"/>&nbsp;	
		<input id="recount_btn" class="btn btn-danger" type="button" value="重新点收" onclick="location.reload();"/>
		<a href="${ctx}/cusInstorageCount" class="btn btn-info" >返回</a>
	  </div>
	
</body>
</html>
